<template>
  <div class="">
    <h1>京东</h1>
    <heads @aa="fun"></heads>
    <!-- 把父组件的事件fun通过自定义事件传给子组件 -->

    <con :aa="msg" bb="来自父组件的bb数据" />
    <!-- 父传子 -->
    <footers></footers>

    <hr />
    <h5>这是来自子组件的数据msg:{{ fromson }}</h5>
  </div>
</template>

<script>
import heads from "../components/Header.vue";
import con from "../components/Content.vue";
// import footers from "../components/Footers.vue";
import footers from "@/components/Footers.vue";
//注意：起名字的时候不能用关键字 如果不确定就加个s
// @的意思是src路径
export default {
  data() {
    return {
      msg: "这是父组件的数据",
      fromson: "",
    };
  },
  components: {
    heads,
    con,
    footers,
  },
  methods: {
    fun(val) {
      console.log(val);
      this.fromson = val;
    },
    //父组件的事件传给子组件使用
  },
};
</script>

<style lang="scss"></style>
